// Buttons
.btn {
  &.btn-flat {
    font-weight: 500;
    color: inherit;
    background-color: transparent;
    box-shadow: none;
    &:not([disabled]):not(.disabled):active {
      box-shadow: none;
    }
  }
}

// Floating button
.btn-floating {
  position: relative;
  z-index: 1;
  display: inline-block;
  padding: 0;
  margin: $btn-floating-margin;
  overflow: hidden;
  vertical-align: middle;
  cursor: pointer;
  border-radius: $btn-floating-border-radius;
  box-shadow: $z-depth-1-half;
  transition: $btn-floating-transtion;
  @include make-btn-floating($btn-floating-width, $btn-floating-height, $btn-floating-icon-size, $btn-floating-line-height);
  i {
    display: inline-block;
    width: inherit;
    color: $white-base;
    text-align: center;
  }
  &:hover {
    box-shadow: $z-depth-2;
  }
  &:before {
    border-radius: 0;
  }
  &.btn-sm {
    @include make-btn-floating($btn-floating-width-sm, $btn-floating-height-sm, $btn-floating-icon-size-sm, $btn-floating-line-height-sm);
  }
  &.btn-lg {
    @include make-btn-floating($btn-floating-width-lg, $btn-floating-height-lg, $btn-floating-icon-size-lg, $btn-floating-line-height-lg);
  }
}

// Fixed action button
.fixed-action-btn {
  position: fixed;
  right: $fixed-action-btn-right;
  bottom: $fixed-action-btn-bottom;
  z-index: 998;
  margin-bottom: 0;
  overflow: hidden;
  height: 500px;
  display: flex;
  align-items: flex-end;
  padding: $fixed-action-btn-padding-top 15px 15px 15px;
  padding-bottom: 15px;
  padding-left: 15px;
  padding-right: 15px;
  ul {
    position: absolute;
    right: 0;
    bottom: $fixed-action-btn-ul-bottom;
    left: 0;
    display: flex;
    flex-direction: column;
    height: 0;
    padding: 0;
    margin: 0 0 15px;
    text-align: center;
    transition: 400ms all;
    opacity: 0;
    margin-bottom: 0;
    li {
      z-index: 0;
      display: flex;
      margin-right: auto;
      margin-bottom: $fixed-action-btn-li-margin-bottom;
      margin-left: auto;
    }
    a {
      &.btn-floating {
        opacity: 0;
        transition-duration: .4s;
        transform: scale(.4) translate(0);
        &.shown {
          opacity: 1;
          transform: scale(1) translate(0);
        }
      }
    }
  }
  &.active ul {
    height: 300px;
    margin-bottom: 40px;
    opacity: 1;
  }
}

button, html [type="button"], [type="reset"], [type="submit"] {
  appearance: none;
}

// Rounded buttons
.btn-rounded {
  border-radius: $btn-rounded-border-radius;
}
